<template>
    <div id="app">
        <section class="hero is-small is-info is-bold" style="padding: 0rem 1rem 0rem 1rem !important;">
            <div class="hero-body" style="padding-top: 0px;padding-bottom: 1.5rem;">
                <div class="container">
                    <div class="column">
                        <router-link :to="{name:'Cate',params:{id:name}}" v-for="name in cates" class="button is-black cate-button" :key="name" >{{name}}</router-link>
                    </div>
                    <p>
                        <strong>如果喜欢这个网站,请赶快加入收藏夹,或者添加到桌面快捷方式</strong>
                    </p>
                    <div class="columns">
                        <div class="column is-offset-2 is-7">
                            <input class="input" v-model="keyword" type="text" placeholder="美剧名称 英文单词">
                        </div>
                        <div class="column is-1">
                            <a class="button is-outlined" @click="search"><span class="fa fa-search"></span></a>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <section class="section">
            <div class="container is-warning">
                <router-view :collections="collections" :albums="albums"></router-view>
            </div>
        </section>
        <footer class="footer">
            <div class="container">
                <div class="content has-text-centered">
                    <p>
                        <a href="//www.trytv.org"> <strong>tryTV美剧</strong>tryTV.org</a>最好de美剧资源分享网站
                    </p>
                    <p>
                        <a href="//www.mojotv.cn"> <strong>mojoTV资讯</strong>mojoTV.cn</a>最好de美剧娱乐资讯网站
                    </p>
                    <p>
                        <a href="//info.trytv.org"> <strong>微博,秒拍,优酷,腾讯,爱奇艺视频解析下载</strong>info.tryTV.org</a>最好的视频解析,视频下载网站
                    </p>
                    <p>
                         <strong>如果喜欢这个网站,请赶快加入收藏夹吧</strong>
                    </p>
                    <p>
                        <a href="http://www.weibo.com/dejavuzhou/home?wvr=5&c=spr_sinamkt_buy_hyww_weibo_p131"> <strong>发现不能观看的美剧,请关注我的<b style="color:red">微博:mojotv_cn</b>给我私信吧</strong></a>
                    </p>
                </div>
            </div>
        </footer>
    </div>
</template>
<script>
    import {api} from '@/tools/api'
    export default {
        name: 'app',
        data () {
            return {
                cates: [
                    '已看',
                    '人气','最新','好评','英剧',
                    '纪录片',
                    '合集',
                    '喜剧', '剧情', '爱情', '科幻', '动作', '犯罪', '冒险', '家庭', '战争', '历史', '恐怖', '伦理',
                    '综艺',
                    '公开课',
                ],
                keyword:'',
                collections:[],
                albums:[],
                breadCrumbs:[],
            }
        },
        methods:{
            search(){
                this.$router.push({name:'Search',params:{keyword:this.keyword}})
            },
        },
        created(){
            let that = this
            api.get('/rrv/index')
                .then(function (response) {
                    that.collections = response.data.data.index
                    response.data.data.album.forEach((season)=>{
                        season.cover = season.coverUrl
                        season.title = season.name
                        season.albumId = season.id
                    })
                    that.albums = response.data.data.album
                })
                .catch(function (error) {
                    console.log(error);
                });
        }
    }


</script>

<style>
    .cate-button{
        margin: 0.1rem;
    }
    body {
        text-align: center!important;
    }


</style>
